let createMessageLeft = () => {
  let messageLeft = document.createElement("div");
  messageLeft.className = "third-left";
  messageLeft.innerHTML = `
        <div class='left-top'>
            <ul class='third-ul animated slideInDown'>
                <li class='third-li third-active'>全部</li>
            </ul>
        </div>
        <div class='left-bottom'>
            <div class='left-bottom-top animated bounceInLeft'>
                <i class='iconfont icon-sousuo'></i>
                <input class='search-student' placeholder='搜索学生'  />
            </div>
            <ul class='bottom-ul'>
            </ul>
        </div>
    `;
  return messageLeft;
};

let createMessageMiddle = () => {
  let messageMiddle = document.createElement("div");
  messageMiddle.className = "third-middle";
  messageMiddle.innerHTML = `
        <div class='middle-top'>
            <div class="teachername" style="margin: auto;font-size: 12px;color: #3C3C3C;"></div>
            <div style="position: absolute;right: 19px;display: flex;align-items: center;">
                <i style="margin-right: 7px;" class="iconfont icon-gantanhao"></i>
                <span style="color: #818181;">你收到骚扰信息可以举报</span>
            </div>
        </div>
        <div class='middle-center'>
            <ul class='middle-ul'>
                
            </ul>
        </div>
        <div class='middle-bottom'>
            <div style="display: flex;align-items: center;padding-top: 20px;justify-content: space-between; align-items: self-start;max-width: 100%;">
                <div type="input" class="bottom-input" tabindex="-1" contenteditable="true" style="border: none;margin-left: 28px;color: #828282;">
                    <div>请输入您的信息</div>
                </div>
                <div style="display: flex;align-items: center;">
                    <i class="iconfont icon-tupian upload" style="cursor:pointer;font-size: 22px;color: #898989;margin-right: 17px;">
                    </i>
                    <i class="iconfont icon-fasong" style="cursor:pointer;font-size: 22px;color: #4580FE;margin-right: 26px;"></i>
                </div>
            </div>
        </div>
    `;
  return messageMiddle;
};

let createMessageRight = () => {
  let messageRight = document.createElement("div");
  messageRight.className = "third-right animated fadeInDown";
  // messageRight.appendChild(createStudentDetail())
  return messageRight;
};

export {
    createMessageLeft,
    createMessageMiddle,
    createMessageRight
}